import React from 'react'
import { ScaleS, ScaleT } from 'src/utils/ScreenUtil'
import { Text, View, StyleSheet } from 'react-native'
import PropTypes from 'prop-types'
import { getMonthStrFromFullTime, getYearFromFullTime } from '../../utils/TimeUtil'
import CustomTextEllipsize from 'src/components/custom-text-ellipsize'

export default function WorkExperienceCardNew (props) {
  const { style, dataSource, type } = props
  return (
    <View style={style}>
      <Text style={styles.timeLabel}>
        {`${getYearFromFullTime(dataSource.beginTime)}.${getMonthStrFromFullTime(dataSource.beginTime)}`}-{`${getYearFromFullTime(dataSource.endTime)}.${getMonthStrFromFullTime(dataSource.endTime)}`} | {dataSource.positionName}
      </Text>
      <Text style={styles.workCompanyName}>{dataSource.companyName}</Text>
      { type === 'textEllipsize'
        ? (<CustomTextEllipsize style={styles.workCompanyContent} text={dataSource.achievement} numberOfLines={3} />)
        : (<Text style={styles.workCompanyContent}>{dataSource.achievement}</Text>)}
    </View>
  )
}
WorkExperienceCardNew.propTypes = {
  dataSource: PropTypes.object,
  style: PropTypes.object,
  type: PropTypes.string
}
WorkExperienceCardNew.defaultProps = {
  dataSource: {}
}
const styles = StyleSheet.create({
  timeLabel: {
    color: '#000000',
    fontSize: ScaleT(15),
    fontWeight: '300',
    marginBottom: ScaleS(15)
  },
  workCompanyName: {
    color: '#3C3C3C',
    fontSize: ScaleT(14),
    fontWeight: '300',
    marginBottom: ScaleS(16)
  },
  workCompanyContent: {
    color: '#818181',
    fontSize: ScaleT(14),
    fontWeight: '300',
    lineHeight: ScaleS(28)
  }
})
